<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button class="sub">-</button>
    <input type="text" class="ipt" value="10">
    <button class="add">+</button>
</body>
</html>
<script>

    //重写 闭包 - 沙箱模式 案例

    function initTxt(n){

        let sum = n

        return {
            get count(){
                return sum
            },
            set count(val){
                return sum = val
            }
        }
    }


    const sub = document.querySelector('.sub')
    const add = document.querySelector('.add')
    const ipt = document.querySelector('.ipt')

    let txt = initTxt(+ipt.value)

    // console.log(++txt.count);

    // for(let i = 0;i < 5;i++){
    //     console.log(++txt.count);
    // }

    sub.addEventListener('click',()=> {

        ipt.value = --txt.count

    })

    // sub.onclick = function(){
    //     // txt--
    //     // ipt.value = txt
    //     ipt.value = --txt.count
    // }
    add.onclick = function(){
        // txt++
        // ipt.value = txt
        ipt.value = ++txt.count
    }

</script>